﻿@using ETD.Common.Extension;
@using ETD.WebOrganization.Libs.Helper;
@using ETD.WinClient.Config;
@using ETD.Domain.EnumModels;
@using ETD.Domain.WebModels;
@using ETD.Common;
@using ETD.WebOrganization.Libs.Controls;
@model ETD.WebOrganization.Areas.Web.Models.FacilityManageModel
@{
    ViewBag.Title = "设备管理";
}
@{
    var uiFacilityList = Model.UIFacilityList;
}
<style>
    .facilityItemLink {
    }

    .colorRed {
        color: red;
    }

    .colorGray {
        color: gray;
    }

    .colorBlue {
        color: #50d2c2;
    }
</style>
<div id="contentContainer" class="weui-tab__bd-item weui-tab__bd-item--active">
    <!--最近收款列表 begin:-->
    <div class="weui-cells__title">

        <div class="weui-search-bar ">
            <form class="weui-search-bar__form">
                <div class="weui-search-bar__box">
                    <i class="weui-icon-search"></i>
                    <input type="search" class="weui-search-bar__input" placeholder="搜索" required="" />
                    <a href="javascript:" class="weui-icon-clear"></a>
                </div>
                <label class="weui-search-bar__label"><i class="weui-icon-search"></i><span>搜索</span></label>
            </form>
            <a href="javascript:" class="weui-search-bar__cancel-btn">取消</a>
        </div>
    </div>

    <template>
        <div class="weui-cells" v-for="(item, index) in itemList ">
            <div class="weui-cell weui-cell_access income_current">
                <div class="weui-cell__bd facilityItemLink" v-on:click="onFacilityItemLinkClick(item)">
                    <span style="vertical-align: middle">编号：{{item.Code}}</span>
                </div>
                <div class="weui-cell__ft">
                    <span style="font-size:12px;"></span>
                </div>
            </div>
            <div class="weui-flex weui-cells__tips">
                <div class="weui-flex__item" style="padding-right:5px;"><div class="placeholder">医院：<span>{{item.OrganizationName}}</span></div></div>

                <div class="weui-flex__item" style="padding-left:5px;"><div class="placeholder">科室：<span>{{item.SectionOfficeName}}</span> </div></div>
            </div>
            <div class="weui-flex weui-cells__tips">
                <div class="weui-flex__item" style="padding-right:5px;"><div class="placeholder">床号：<span>{{item.BedNumber}}</span></div></div>
                @*使用中（绿色显示）， 空闲（目前灰色），设备异常（红色）*@

                <div class="weui-flex__item" style="padding-left:5px;"><div class="placeholder">状态：<span v-bind:class="item.classFacilityStatusName">{{item.FacilityStatusName}}</span></div></div>

            </div>
            <div class="weui-flex weui-cells__tips">

                <div class="weui-flex__item" style="padding-right:5px;"><div class="placeholder">最近使用：<span>{{toYmdhmsTime(item.LastUnlockDate)}}</span> </div></div>
            </div>
        </div>
    </template>
    <!--最近收款列表 end; -->
</div>

@section ScriptSection{
    <script>
        new Vue({
            el: '#contentContainer',
            data: {
                itemList: [],
                page: 0,
                hasMore: true,
                loading: false,
                loadingText: '向上滑动加载更多...'
            },
            created () {
                let self = this;
                this.getItemList();
                this.scrollBottom();
            }
            ,
            mounted () {
                // 添加滚动事件，检测滚动到页面底部
                //window.addEventListener('scroll', this.scrollBottom)
            },
            methods: {
                scrollBottom: function () {
                    let self = this;
                    var baseVue = new BaseVue();
                    baseVue.scrollBottom(self);
                },
                onFacilityItemLinkClick: function (item) {
                    PageObj.onFacilityItemLinkClick(item.FacilityID);
                },
                decimalF2: function (num) {
                    return StringHelper.decimalF2(num);
                },
                toYmdhmsTime: function (time) {
                    return TimeHelper.ymdhmsTime(time);
                },
                getItemList: function () {
                    let self = this;
                    var organizationID = WinHelper.getUrlParam("organizationID");
                    var url = '@Url.Action("FindFacilityList", "Facility")';
                    url = WinHelper.urlWrap(url);
                    var paras = {};
                    paras.OrganizationID = organizationID;
                    paras.CurrentPageIndex = self.page;
                    showCommonLoading();
                    // 获取今日新闻
                    axios.post(url, paras)
                      .then((res) => {
                          hideCommonLoading();
                          console.log(res.data);
                          this.bindItemList(res.data);
                      });
                },
                bindItemList: function (data) {
                    let self = this;
                    $.each(data.Data.FacilityList, function (i, item) {
                        if (item.FacilityStatusID == '@((int)EFacilityStatus.Used)') {
                            item.classFacilityStatusName = "colorBlue";
                        } else if (item.FacilityStatusID == '@((int)EFacilityStatus.UnUsed)') {
                            item.classFacilityStatusName = "colorGray";
                        } else if (item.FacilityStatusID == '@((int)EFacilityStatus.Error)') {
                            item.classFacilityStatusName = "colorRed";
                        }
                        self.itemList.push(item);
                    });

                    self.loadingText = '向上滑动加载更多...'
                    if (self.itemList.length >= data.TotalCount) {
                        self.loadingText = "没有更多数据了...";
                        self.hasMore = false;
                        self.loading = false;
                    } else {
                        self.hasMore = true;
                        self.loading = true;
                    }
                }
            }
        })
    </script>
    <script>
        $(function () {
            PageObj.init();
        });
        var PageObj = {};
        PageObj.init = function () {
            $(".facilityItemLink").click(PageObj.onFacilityItemLinkClick);
        };
        PageObj.onFacilityItemLinkClick = function (facilityID) {
            console.log("facilityid=" + facilityID);
            window.location.href = "@Url.Action("FacilityEdit", "Facility")?facilityID=" + facilityID;
        }

        PageObj.login = function () {
            @*var paras = {};
            paras.UserName = $("#txtUsername").val().trim();
            paras.Password = $("#txtPassword").val().trim();

            console.log(JSON.stringify(paras));

            ajaxPost("@Url.Action("LoginFromWeb", "Account")", paras, function (data) {
                console.log(data);
                if (data.Status) {
                    $.toast(data.Info);
                    window.setTimeout(function () { window.location.href = "@Url.Action("Home", "Home")"; }, 2000);
                } else {
                    $.toast(data.Info, "forbidden");
                }
            });*@
        }
    </script>
}